@import "base.scss";
@import "mixin.scss";

.SY-content {
  .payComplete {
    width: 90 * $fontSize10;
    margin:10* $fontSize12 auto 16 * $fontSize10;
    background: $colorfff;
    > img {
      width: 13 * $fontSize10;
      height: 13 * $fontSize10;
      margin: $fontSize20 0 $fontSize10;
    }
    .info {
      font-size: $fontSize22;
      color: $color000;
      margin-bottom: (3 * $fontSize10) / 2;
    }
    .msgDetail {
      border-top: 1px solid $colore5;
      padding-top: $fontSize20;
    }
    .user {
      .userPic {
        width: 2 * $fontSize18;
        height: 2 * $fontSize18;
        vertical-align: middle;
        margin-right: $fontSize10 / 2;
        img {
          width: 100%;
          height: 100%;
        }
      }
      .nickName {
        font-size: $fontSize16;
        color: $color000;
      }
    }
    .payDetail {
      font-size: $fontSize14;
      color: #d5d5d5;
      .text {
        padding-left: 40 * $fontSize10 + 5;
        margin:$fontSize10 0;
      }
      span {
        font-size: $fontSize16;
        color: $color000;
      }
    }
    .btns{
      margin:3 * $fontSize10 0 0;
      padding-bottom: 5 * $fontSize10;
      a {
        width: 12 * $fontSize10;
        height: 4 * $fontSize10;
        line-height: 4 * $fontSize10;
        font-size: $fontSize16;
      }
      .next {
        margin-right: 5 * $fontSize10 / 2;
        color: $colorfff;
        @include border(1px,solid,#6c6c6c);
        background: #6c6c6c;
        &:hover {
          background: $color333;
        }
      }
      .back {
        color: $color000;
        @include border(1px,solid,#b5b5b5);
        &:hover {
          background: #f0f2f3;
        }
      }
    }
  }
  .payFail {
    @extend .payComplete;
  }
  .S-main {
    .titleBox {
      width: 60 * $fontSize10;
      font-size: 3 * $fontSize10;
      color:$color333;
      padding: 2 * $fontSize12 + 1 0;
      margin: 0 auto;
      border-bottom: 1px solid $colore5;
    }
  }
}


